<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--    使用script引入VUE-->
    <script src="../js/vue.js"></script>
<!--  初识Vue：
  1、使用Vue必须创建一个Vue的实例，且需要传入一个配置对象
  2、root容器里的代码依旧符合html规范，只不过混入了一些特殊的Vue语法
  3、root容器里的代码被称为“Vue模板”
  -->
</head>
<body>
    <!--容器内容-->
    <div id="root">
        <h1>{{hello}}</h1>
    </div>
    <script>
        //阻止vue再启动时生成生产提示
        Vue.config.productionTip = false

        //创建vue实例
        const x = new Vue({
            el:'#root',//el用于指定当前Vue实例为哪个容器服务，值通常为css选择器
            data(){//data用于存放数据 数据将提供给容器进行使用
                return {
                    hello:'Hello World'
                }
            }
        })
    </script>
</body>
</html>